<template>
  <div class="comment">
    <header>
      <h1>发表评论</h1>
      <hr/>
    </header>

    <textarea v-model="content" placeholder="请输入您要评论的内容">

    </textarea>
    <van-button class="btn" type="danger">提交</van-button>
    <ul class="comment-list">
      <li class="item">
        <header>
          <span>第一楼</span>
          <span>用户：匿名用户</span>
          <span>发表时间：354254</span>
        </header>

        <div>6666</div>
      </li>

      <li class="item">
        <header>
          <span>第一楼</span>
          <span>用户：匿名用户</span>
          <span>发表时间：354254</span>
        </header>

        <div>6666</div>
      </li>

      <li class="item">
        <header>
          <span>第一楼</span>
          <span>用户：匿名用户</span>
          <span>发表时间：354254</span>
        </header>

        <div>6666</div>
      </li>
    </ul>
    <van-button plain class="btn" type="danger">加载更多</van-button>

  </div>
</template>
<script>
export default {
  data: () => ({
    content: ''
  }),
  created () {},
  methods: {}
}
</script>
<style lang="less" scoped>
.comment{
  textarea{
    width: 100%;
    height: 85px;
  }
  .btn{
    width: 100%;
  }
  .comment-list{
    padding: 6px 0px;
    .item{
      padding: 4px 0px;
      header{
        font-size: 12px;
        line-height: 30px;
        display: flex;
        justify-content: space-between;
      }
    }
  }
}
</style>
